import { useFormModal } from '@/hooks/useFormModal';
import { getFormSchema } from './form-schema';
import { createVNode, toRaw } from 'vue';
import { Modal, Switch } from 'ant-design-vue';
import { QuestionCircleOutlined } from '@ant-design/icons-vue';
import { storage } from '@/utils/Storage';

export const columns: TableColumn[] = [
  // 角色列表
  {
    title: '',
    dataIndex: 'id',
    hidden: true,
  },
  {
    title: '角色名称',
    width: 100,
    dataIndex: 'roleName',
  },
  {
    title: '角色描述',
    dataIndex: 'description',
  },
  {
    title: '状态',
    dataIndex: 'isEnable',
    width: 100,
    slots: {
      customRender: 'isEnable',
    },
    slotsType: 'component',
    slotsFunc: (row, refreshTableData) =>
      createVNode(Switch, {
        'checked-children': '启用',
        'un-checked-children': '禁用',
        checked: row.isEnable == 1,
        onChange: async (e) => {
          const params = {
            id: row.id,
            isEnable: e ? 1 : 0,
            roleName: row.roleName,
            operatorId: storage.get('userid'),
          };
          refreshTableData();
        },
      }),
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: 140,
    slots: {
      customRender: 'action',
    },
    actions: [
      {
        type: 'button', // 控制类型，默认为a,可选： select | button | text
        text: '删除',
        func: async ({ record }, refreshTableData) =>
          Modal.confirm({
            title: '提示',
            icon: createVNode(QuestionCircleOutlined),
            content: '您确定要删除所有选中吗？',
            onOk: async () => {},
          }),
      },
      {
        type: 'button', // 控制类型，默认为a,可选： select | button | text
        text: '编辑',
        func: async ({ record }, refreshTableData) =>
          useFormModal({
            title: '编辑用户',
            fields: record,
            formSchema: getFormSchema(),
            handleOk: async (modelRef) => {
              const params = {
                ...toRaw(modelRef),
                operatorId: storage.get('userid'),
              };
              return;
            },
          }),
      },
    ],
  },
];
